<template>
  <div class="page flex-col">
    <div class="group_1 flex-col">
      <div class="group_2 flex-col">
        <div class="box_1 flex-col">
          <div class="group_3 flex-row">
            <div class="section_1 flex-col">
              <img class="image_1" referrerpolicy="no-referrer"
                src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng9bb6df041b2afdfd339bfb39255bc60087a804c05ec378596b118bd634085677" />
              <div class="image-wrapper_1 flex-col">
                <img class="image_2" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngf06aa01450e1ff813e494e19fc16e2ca51506ce0adb2bfa6b1a926cb6a46f68f" />
              </div>
              <div class="text-wrapper_1 flex-col">
                <span class="text_1">项目招标信息</span>
              </div>
            </div>
            <div class="group_50 flex-col justify-between">
              <div class="image-wrapper_2 flex-col">
                <img class="image_3" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng26572584bed15f21b61b556d0c5e8cadcb264b0fff656b81aace2b923f41ca26" />
              </div>
              <div class="section_14 flex-row">
                <div class="box_3 flex-col"></div>
                <span class="text_2">未开始</span>
                <div class="box_4 flex-col"></div>
                <span class="text_3">进行中</span>
                <div class="box_5 flex-col"></div>
                <span class="text_4">已完成</span>
              </div>
              <div class="text-wrapper_47 flex-row justify-between">
                <span class="text_5">{{ biddingInfo?.noStartedCount }}</span> <span class="text_6">{{
                  biddingInfo?.progressCount }}</span>
                <span class="text_7">{{ biddingInfo?.completedCount }}</span>
              </div>
            </div>
            <div class="group_51 flex-col">
              <div class="block_1 flex-col">
                <div class="text-wrapper_3">
                  <span class="text_8">项目金额信息</span>
                  <span class="text_9">（万元）</span>
                </div>
              </div>
              <div class="box_35 flex-row justify-between">
                <div class="text-wrapper_4 flex-col">
                  <span class="text_10">合同</span>
                </div>
                <img class="label_1" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPnga56c1bf6422dcdde4226d122403027671316989f0eb6a27d3ae3acaf39897b1c" />
                <div class="group_4 flex-col">
                  <span class="text_11">计划</span>
                  <img class="image_4" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng269dca063b810bcf6c013138b19fd56d34d3acdca78d218e743a3e9b8a699b8b" />
                </div>
                <img class="label_2" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPnga56c1bf6422dcdde4226d122403027671316989f0eb6a27d3ae3acaf39897b1c" />
                <div class="group_5 flex-col">
                  <span class="text_12">需求</span>
                  <img class="image_5" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng22e5a91f23d8369a0709f6b4b7dab665fa2fe7873d1c3f49bf4bba2a10f4038d" />
                </div>
                <img class="label_3" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPnga56c1bf6422dcdde4226d122403027671316989f0eb6a27d3ae3acaf39897b1c" />
                <div class="group_6 flex-col">
                  <span class="text_13">供应</span>
                  <img class="image_6" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngadb8ae8fda64515771f2488bd22f3d8743eeee4bce02f9173394517edf02bbcd" />
                </div>
                <img class="label_4" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPnga56c1bf6422dcdde4226d122403027671316989f0eb6a27d3ae3acaf39897b1c" />
                <div class="text-wrapper_5 flex-col">
                  <span class="text_14">到货</span>
                </div>
                <img class="label_5" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPnga56c1bf6422dcdde4226d122403027671316989f0eb6a27d3ae3acaf39897b1c" />
                <div class="text-wrapper_6 flex-col">
                  <span class="text_15">验收</span>
                </div>
                <img class="label_6" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPnga56c1bf6422dcdde4226d122403027671316989f0eb6a27d3ae3acaf39897b1c" />
                <div class="text-wrapper_7 flex-col">
                  <span class="text_16">结算</span>
                </div>
                <img class="label_7" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPnga56c1bf6422dcdde4226d122403027671316989f0eb6a27d3ae3acaf39897b1c" />
                <div class="text-wrapper_8 flex-col">
                  <span class="text_17">验工计价</span>
                </div>
              </div>
              <div class="text-wrapper_48 flex-row justify-between">
                <span class="text_18">50%</span>
                <span class="text_19">30%</span>
                <span class="text_20">20%</span>
              </div>
              <div class="box_36 flex-row justify-between">
                <div class="group_7 flex-row">
                  <img class="label_8" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng80550e5193557700c3e1345489f0ef379f7370c9b984ea3aea85607b65a2d8c4" />
                  <div class="text-wrapper_49 flex-col justify-between">
                    <span class="text_21">完成招标概算价</span>
                    <span class="text_22">{{ projecAmounttInfo?.completeBiddingPrice }}</span>
                  </div>
                  <img class="label_9" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngde823f965660a14e7c2b905cb2687af8ad6dbfea37a72b80ea516c3356a07aab" />
                  <div class="text-wrapper_50 flex-col justify-between">
                    <span class="text_23">投标报价</span>
                    <span class="text_24">{{ projecAmounttInfo?.bidPrice }}</span>
                  </div>
                </div>
                <div class="group_8 flex-row">
                  <img class="label_10" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngee1c3a192385e15a14c57774ca95292bec1f05a8d6bf21ae01f171206fe15cbb" />
                  <div class="text-wrapper_51 flex-col justify-between">
                    <span class="text_25">未招标概算价</span>
                    <span class="text_26">{{ projecAmounttInfo?.noBiddingPrice }}</span>
                  </div>
                  <img class="label_11" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPnge2579ca02df2c75ba8de74792c1dfd17587b338a4d4f9f2c32153e9a3e59ffb6" />
                  <div class="text-wrapper_52 flex-col justify-between">
                    <span class="text_27">招标进行中概算价</span>
                    <span class="text_28">{{ projecAmounttInfo?.progressBiddingPrice }}</span>
                  </div>
                </div>
              </div>
              <div class="box_37 flex-row justify-between">
                <div class="group_9 flex-col"></div>
                <div class="group_10 flex-col"></div>
                <div class="group_11 flex-col"></div>
                <div class="group_12 flex-col"></div>
                <div class="group_13 flex-col"></div>
                <div class="group_14 flex-col"></div>
                <div class="group_15 flex-col"></div>
                <div class="group_16 flex-col"></div>
              </div>
            </div>
            <div class="section_4 flex-col">
              <div class="group_52 flex-row">
                <div class="box_6 flex-col"></div>
                <span class="text_29">通知数量</span>
                <!-- <span class="text_30">40%</span> -->
                <span class="text_31">{{ documentInfo?.noticeCount}}</span>
              </div>
              <div class="group_53 flex-row">
                <div class="box_7 flex-col"></div>
                <span class="text_32">规章制度</span>
                <!-- <span class="text_33">35%</span> -->
                <span class="text_34">{{ documentInfo?.regulationsCount}}</span>
              </div>
              <div class="group_54 flex-row justify-between">
                <div class="box_8 flex-col"></div>
                <span class="text_35">报告数量</span>
              </div>
              <div class="group_55 flex-row justify-between">
                <div class="section_5 flex-col"></div>
                <span class="text_36">请示数量</span>
              </div>
              <div class="group_21 flex-col">
                <div class="text-wrapper_53 flex-row justify-between">
                  <!-- <span class="text_37">20%</span> -->
                  <span class="text_38">{{ documentInfo?.reportCount}}</span>
                </div>
                <div class="text-wrapper_54 flex-row justify-between">
                  <!-- <span class="text_39">5%</span> -->
                  <span class="text_40">{{ documentInfo?.requestCount}}</span>
                </div>
              </div>
              <div class="group_22 flex-col"></div>
            </div>
            <div class="text-wrapper_16 flex-col">
              <span class="text_41">投标供应商数量</span>
              <span class="text_42">{{ biddingInfo?.bddingSupplierCount }}</span>
            </div>
            <div class="text-wrapper_17 flex-col">
              <span class="text_43">中标供应商数量</span>
              <span class="text_44">{{ biddingInfo?.winningSupplierCount }}</span>
            </div>
            <div class="section_6 flex-col justify-end">
              <div class="image-wrapper_3 flex-col">
                <img class="thumbnail_1" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngbaf52911d3647fca53ed608865a6f6ab99234e06cac5e9b7ce1ad675519004d7" />
              </div>
              <div class="image-wrapper_4 flex-col">
                <img class="thumbnail_2" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngc613cfa3d78a4e4046b7e7b44f7d54c768531823bb38093bdecaa4c4e09f1f29" />
              </div>
              <img class="image_7" referrerpolicy="no-referrer"
                src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngf6975aa93055c95bdff5c68407aecde0d1e90144fb167f04831803730417b8cb" />
              <span class="text_45">项目资料</span>
            </div>
            <span class="text_46">{{ projecAmounttInfo?.contractAmount }}</span> <span class="text_47">{{ projecAmounttInfo?.deliveryCount }}</span>
            <span class="text_48">{{ projecAmounttInfo?.demandAmount }}</span> <span class="text_49">{{ projecAmounttInfo?.settlementAmount }}</span>
            <span class="text_50">{{ projecAmounttInfo?.planAmount }}</span> <span class="text_51">{{ projecAmounttInfo?.acceptanceAmount }}</span>
            <span class="text_52">{{ projecAmounttInfo?.supplyAmount }}</span> <span class="text_53">{{ projecAmounttInfo?.checkPriceAmount }}</span>
          </div>
          <div class="box_38 flex-row justify-between">
            <div class="box_9 flex-col">
              <div class="text-wrapper_18">
                <span class="text_54">甲供物资品类</span>
                <span class="text_55">（种）</span>
              </div>
            </div>
            <div class="text-wrapper_37 flex-col">
              <span class="text_93">物资供应统计</span>
            </div>
          </div>
          <div class="box_39 flex-row">
            <div class="box_40 flex-col">
              <div class="group_56 flex-row">
                <div class="group_24 flex-col">
                  <span class="text_56">{{ matCategory?.materialsCount}}</span>
                  <div class="box_11 flex-col">
                    <div class="section_7 flex-col"></div>
                  </div>
                </div>
                <div class="group_25 flex-col">
                  <span class="text_57">{{ matCategory?.equipmentCount}}</span>
                  <div class="group_26 flex-col">
                    <div class="group_27 flex-col"></div>
                  </div>
                </div>
                <div class="group_28 flex-col">
                  <span class="text_58">{{ matCategory?.sparePartsCount}}</span>
                  <div class="section_8 flex-col">
                    <div class="box_12 flex-col"></div>
                  </div>
                </div>
                <div class="group_29 flex-col">
                  <div class="group_30 flex-col"></div>
                  <div class="text-wrapper_19 flex-col">
                    <span class="text_59">{{ matCategory?.toolsCount}}</span>
                  </div>
                </div>
              </div>
              <div class="group_57 flex-row justify-between">
                <div class="text-wrapper_20 flex-col">
                  <span class="text_60">材料</span>
                </div>
                <div class="text-wrapper_21 flex-col">
                  <span class="text_61">设备</span>
                </div>
                <div class="text-wrapper_22 flex-col">
                  <span class="text_62">备品备件</span>
                </div>
                <div class="text-wrapper_23 flex-col">
                  <span class="text_63">工器具</span>
                </div>
              </div>
              <div class="box_14 flex-col">
                <div class="text-wrapper_24">
                  <span class="text_64">自购物资监督</span>
                  <span class="text_65">（个）</span>
                </div>
              </div>
              <div class="text-wrapper_55 flex-row justify-between">
                <span class="text_66">重要自购物资</span>
                <span class="text_67">年度采购计划</span>
              </div>
              <div class="group_58 flex-row justify-between">
                <div class="image-text_10 flex-col justify-between">
                  <div class="text-wrapper_26 flex-col">
                    <span class="text_68">{{selfBuyingMatSupervision?.selfBuyingMatCount}}</span>
                  </div>
                  <span class="text-group_1">公开招标监督</span>
                </div>
                <!-- <div class="image-text_11 flex-col justify-between">
                  <div class="text-wrapper_27 flex-col">
                    <span class="text_69">{{selfBuyingMatSupervision?.annualPurchasePlanCount}}</span>
                  </div>
                  <span class="text-group_2">合同核备</span>
                </div> -->
                <!-- <div class="image-text_12 flex-col justify-between">
                  <div class="text-wrapper_26 flex-col">
                    <span class="text_68">{{selfBuyingMatSupervision?.selfBuyingMatCount}}</span>
                  </div>
                  <span class="text-group_1">公开招标监督</span>
                </div> -->
                <!-- <div class="image-text_13 flex-col justify-between">
                  <div class="text-wrapper_26 flex-col">
                    <span class="text_68">{{selfBuyingMatSupervision?.biddingSupervisionCount}}</span>
                  </div>
                  <span class="text-group_1">公开招标监督</span>
                </div> -->
                <!-- <div class="image-text_14 flex-col justify-between">
                  <div class="text-wrapper_27 flex-col">
                    <span class="text_69">100</span>
                  </div>
                  <span class="text-group_2">合同核备</span>
                </div> -->
                <div class="image-text_15 flex-col justify-between">
                  <div class="text-wrapper_27 flex-col">
                    <span class="text_69">{{selfBuyingMatSupervision?.annualPurchasePlanCount}}</span>
                  </div>
                  <span class="text-group_2">合同核备</span>
                </div>
              </div>
              <div class="group_59 flex-row justify-between">
                <div class="text-wrapper_28 flex-col">
                  <span class="text_70">{{selfBuyingMatSupervision?.biddingSupervisionCount}}</span>
                </div>
                <div class="text-wrapper_29 flex-col">
                  <span class="text_71">{{selfBuyingMatSupervision?.contractFilingCount}}</span>
                </div>
              </div>
              <div class="text-wrapper_30 flex-col">
                <span class="text_72">收货合格统计</span>
              </div>
            </div>
            <div class="box_41 flex-col">
              <div class="text-wrapper_56 flex-col" @click="handleClick('中铁三局CJZQ-3标')">
                <span class="text_120">DK17+563.25</span>
              </div>
              <div class="image-wrapper_5 flex-col">
                <img class="image_13" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng0ab1a1155df887ff448ee380da60eeb7ac67f5ee6489844a4257f9583fb94b87" />
              </div>
              <div class="group_35 flex-col"></div>
            </div>
            <div class="box_42 flex-col justify-between">
              <div class="box_25 flex-col"></div>
              <div class="text-wrapper_57 flex-col" @click="handleClick('中铁十四局CJZQ-7标')">
                <span class="text_121">DK097+797.311</span>
              </div>
            </div>
            <img class="image_15" referrerpolicy="no-referrer"
              src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPnge4e12f503a696202494adbaecbdf880421eabbd99605c7dddacb8fb634fff0a3" />
            <div class="box_43 flex-col">
              <div class="image-wrapper_17 flex-row justify-between">
                <img class="image_16" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng47bfdac9a30caa5141c20793e5d21877f0c18eb87507dc87c4fbce56ef94b624" />
                <img class="image_17" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng47bfdac9a30caa5141c20793e5d21877f0c18eb87507dc87c4fbce56ef94b624" />
              </div>
              <div class="section_15 flex-row">
                <div class="block_11 flex-row">
                  <div class="text-group_22 flex-col">
                    <span class="text_94">{{materialSupplyStatistics?.dispatchedProportion}}</span>
                    <span class="text_95">已发货</span>
                  </div>
                  <!-- <div class="text-group_23 flex-col">
                    <span class="text_94">70%</span>
                    <span class="text_95">已发货</span>
                  </div>
                  <div class="text-group_24 flex-col">
                    <span class="text_94">70%</span>
                    <span class="text_95">已发货</span>
                  </div> -->
                </div>
                <div class="block_12 flex-row">
                  <div class="text-group_25 flex-col">
                    <span class="text_96">{{materialSupplyStatistics?.noDispatchedProportion}}</span>
                    <span class="text_97">未发货</span>
                  </div>
                  <!-- <div class="text-group_26 flex-col">
                    <span class="text_96">30%</span>
                    <span class="text_97">未发货</span>
                  </div>
                  <div class="text-group_27 flex-col">
                    <span class="text_96">30%</span>
                    <span class="text_97">未发货</span>
                  </div> -->
                </div>
                <div class="block_13 flex-row">
                  <div class="text-group_28 flex-col">
                    <span class="text_98">{{materialSupplyStatistics?.receivedGoodsProportion}}</span>
                    <span class="text_99">已收货</span>
                  </div>
                  <!-- <div class="text-group_29 flex-col">
                    <span class="text_98">70%</span>
                    <span class="text_99">已收货</span>
                  </div>
                  <div class="text-group_30 flex-col">
                    <span class="text_98">70%</span>
                    <span class="text_99">已收货</span>
                  </div> -->
                </div>
                <div class="block_14 flex-row">
                  <div class="text-group_31 flex-col">
                    <span class="text_100">{{materialSupplyStatistics?.noReceivedGoodsProportion}}</span>
                    <span class="text_101">未收货</span>
                  </div>
                  <!-- <div class="text-group_32 flex-col">
                    <span class="text_100">30%</span>
                    <span class="text_101">未收货</span>
                  </div>
                  <div class="text-group_33 flex-col">
                    <span class="text_100">30%</span>
                    <span class="text_101">未收货</span>
                  </div> -->
                </div>
              </div>
              <div class="text-wrapper_38 flex-col">
                <span class="text_102">验工计价统计</span>
              </div>
              <div class="section_16 flex-row justify-between">
                <div class="text-wrapper_39 flex-col">
                  <span class="text_103">本年</span>
                </div>
                <div class="text-wrapper_40 flex-col">
                  <span class="text_104">开累</span>
                </div>
              </div>
              <div class="section_17 flex-row justify-between">
                <span class="text_105">40</span>
                <img class="image_18" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng009326031f6de23d8ba3946025268352e35c0ecf2786a9a2b595cef20cb1450b" />
              </div>
              <div class="section_18 flex-row justify-between">
                <span class="text_106">30</span>
                <img class="image_19" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng5a3a88f62469b8cffda935d92a3621ee279f01036bf26eb0e81ed88e4ff6c49b" />
              </div>
            </div>
          </div>
          <div class="box_44 flex-row">
            <div class="block_6 flex-col">
              <div class="group_31 flex-col">
                <div class="group_32 flex-row">
                  <span class="text_73">0</span>
                  <div class="box_18 flex-col"></div>
                  <span class="text_74">100</span>
                </div>
                <img class="image_8" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngcdc91dcd212872901217ca9eab672eae024ccebe052dae4520055d5aa6197e48" />
                <img class="image_9" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPnged9c74c89541d837f95d6b5c155990f6138ca596c1314ccfc4efa7e8368ac487" />
              </div>
              <div class="group_33 flex-col"></div>
              <div class="text-wrapper_31 flex-col">
                <span class="text_75">到货合格率</span>
              </div>
              <div class="group_34 flex-col">
                <div class="text-group_34 flex-col justify-between">
                  <span class="text_76">{{ receiveGoodsQualifiedStatistics?.deliveryQualifiedRate}}</span>
                </div>
                <!-- <div class="text-group_35 flex-col justify-between">
                  <span class="text_76">80</span> <span class="text_77">%</span>
                </div>
                <div class="text-group_36 flex-col justify-between">
                  <span class="text_76">80</span> <span class="text_77">%</span>
                </div> -->
              </div>
            </div>
            <div class="block_7 flex-col">
              <div class="box_19 flex-col">
                <div class="section_9 flex-row">
                  <span class="text_78">0</span>
                  <div class="box_20 flex-col"></div>
                  <span class="text_79">100</span>
                </div>
                <img class="image_10" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngcdc91dcd212872901217ca9eab672eae024ccebe052dae4520055d5aa6197e48" />
                <img class="image_11" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPnged9c74c89541d837f95d6b5c155990f6138ca596c1314ccfc4efa7e8368ac487" />
              </div>
              <div class="box_21 flex-col"></div>
              <div class="text-wrapper_32 flex-col">
                <span class="text_80">验收合格率</span>
              </div>
              <div class="box_22 flex-row">
                <div class="text-group_37 flex-col">
                  <span class="text_82">{{ receiveGoodsQualifiedStatistics?.acceptanceQualificationRate}}</span>
                </div>
                <!-- <div class="text-group_38 flex-col">
                  <span class="text_81">%</span> <span class="text_82">80</span>
                </div>
                <div class="text-group_39 flex-col">
                  <span class="text_81">%</span> <span class="text_82">80</span>
                </div> -->
              </div>
            </div>
            <div class="box_45 flex-col justify-between">
              <div class="text-wrapper_58 flex-col" @click="handleClick('中铁大桥局CJZQ-5标')">
                <span class="text_122">DK115+536.9</span>
              </div>
              <div class="section_12 flex-row">
                <span class="text_92">施工通报</span>
                <div class="image-text_16 flex-row justify-between">
                  <img class="label_12" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng207d8bb64f9c79404ce7aadac244e3e310f20c0c8e8de113b3b6cb7ef47ef633" />
                  <span class="text-group_9">这里是施工通报内容这里是施工通报内容这里是施工通报内容这里是施工通报内容</span>
                </div>
                <div class="image-text_17 flex-row justify-between">
                  <img class="label_12" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng207d8bb64f9c79404ce7aadac244e3e310f20c0c8e8de113b3b6cb7ef47ef633" />
                  <span class="text-group_9">这里是施工通报内容这里是施工通报内容这里是施工通报内容这里是施工通报内容</span>
                </div>
                <div class="image-text_18 flex-row justify-between">
                  <img class="label_12" referrerpolicy="no-referrer"
                    src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng207d8bb64f9c79404ce7aadac244e3e310f20c0c8e8de113b3b6cb7ef47ef633" />
                  <span class="text-group_9">这里是施工通报内容这里是施工通报内容这里是施工通报内容这里是施工通报内容</span>
                </div>
              </div>
            </div>
            <div class="text-wrapper_59 flex-col justify-between">
              <span class="text_107">20</span> <span class="text_108">10</span>
              <span class="text_109">0</span>
            </div>
            <div class="box_46 flex-col">
              <img class="image_20" referrerpolicy="no-referrer"
                src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng9283425b0f9acdcf50e7fac0cc3c2bfd25ca39d95453a6ca94228e819bc95c06" />
              <img class="image_21" referrerpolicy="no-referrer"
                src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng631412ee05ae2fe9f676d6c678826aecf531e4d320c12c0dbf81c27db3d9b695" />
              <div class="group_43 flex-col"></div>
              <div class="text-wrapper_60 flex-row">
                <span class="text_110">第一季度</span>
                <span class="text_111">第二季度</span>
                <span class="text_112">第三季度</span>
                <span class="text_113">第四季度</span>
              </div>
            </div>
          </div>
          <div class="group_36 flex-col">
            <div class="block_15 flex-row justify-between">
              <div class="image-wrapper_6 flex-col">
                <img class="thumbnail_3" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng52c79bb9461ce131540ce453d8ff017a671a13b32386e3a1dd741f195b2b69dc" />
              </div>
              <span class="text_85">中铁XX局&nbsp;CJZQ-1标</span>
            </div>
            <div class="block_16 flex-row justify-between">
              <div class="image-wrapper_7 flex-col">
                <img class="thumbnail_4" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng1eaf865dc28d220b4f9f48d9d8cdf1fa48bc0739f0353b054efb83fdd9103fe5" />
              </div>
              <span class="text_86">中铁XX局&nbsp;CJZQ-2标</span>
            </div>
            <div class="block_17 flex-row justify-between">
              <div class="image-wrapper_8 flex-col">
                <img class="thumbnail_5" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngb54209c0c1957211aeba70bc3397afdcc38b46c8d10371497c9e7d4c71ee415a" />
              </div>
              <span class="text_87">中铁XX局&nbsp;CJZQ-3标</span>
            </div>
            <div class="block_18 flex-row justify-between">
              <div class="image-wrapper_9 flex-col">
                <img class="thumbnail_6" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng612428aa269a566b47acf59b8ee51d30400ba2ce721587697f915d1cd5471829" />
              </div>
              <span class="text_88">中铁XX局&nbsp;CJZQ-4标</span>
            </div>
            <div class="block_19 flex-row justify-between">
              <div class="image-wrapper_10 flex-col">
                <img class="thumbnail_7" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngcb2aba6be54667f7155d1ab015a8a45c96d62ae70a12a7ab7e0b58ef089aa089" />
              </div>
              <span class="text_89">中铁XX局&nbsp;CJZQ-5标</span>
            </div>
            <div class="block_20 flex-row justify-between">
              <div class="image-wrapper_18 flex-col">
                <img class="thumbnail_8" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng40ea52a6cba70a14af6039e8a2f666422b3a83b15cebab06e26d5ca57fc37a20" />
              </div>
              <span class="text_123">中铁XX局&nbsp;CJZQ-6标</span>
            </div>
            <div class="block_21 flex-row justify-between">
              <div class="image-wrapper_19 flex-col">
                <img class="thumbnail_9" referrerpolicy="no-referrer"
                  src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng3ae69c7f5edf4eedc9d4d1a2605813dce3f2ec7aa2c82d3faddc92abd7ddb94b" />
              </div>
              <span class="text_124">中铁XX局&nbsp;CJZQ-7标</span>
            </div>
          </div>
          <div class="group_48 flex-col">
            <div class="image-wrapper_14 flex-col">
              <img class="image_25" referrerpolicy="no-referrer"
                src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngc10d35af29ddaf88c55033938525696b5a9c9bd163bdc1dc88939c20f86d6d46" />
            </div>
            <div class="image-wrapper_15 flex-col">
              <img class="image_26" referrerpolicy="no-referrer"
                src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng0f9623188023be2c56e55e15bf953a150293df4ac01d00822bc856c66d91db38" />
            </div>
            <div class="image-wrapper_16 flex-col">
              <img class="image_27" referrerpolicy="no-referrer"
                src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngece4256908be7523f7f10323d8505cc22e9d4ed66ba5e2d08a885ccb2d40fda6" />
            </div>
            <div class="section_13 flex-col"></div>
            <img class="image_28" referrerpolicy="no-referrer"
              src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng801a4cc2308721f4b216dc7cc8cca74f42bc42fe59a806f01648e5e772e74efc" />
          </div>
          <!-- <div>
            <div>33</div> -->
            <img class="image_29" referrerpolicy="no-referrer"
              src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng4e21193f03c5865f44d8760d2cf26e6f76a779e9e2b311ef1b83c76466bab9c0" />
          <!-- </div> -->
           
            <div class="image_30_text">{{ CheckPriceStatistics?.thisYearFirstQuarter }}</div>
          <img class="image_30" referrerpolicy="no-referrer"
            src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngbe23110263959381acc2b9a39f43c90ef26b363b2e58e86d554cbcede4170ceb" />
            
            <img class="image_31" referrerpolicy="no-referrer"
            src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng4e21193f03c5865f44d8760d2cf26e6f76a779e9e2b311ef1b83c76466bab9c0" />
            <div class="image_32_text">{{ CheckPriceStatistics?.thisYearSecondQuarter }}</div>
            <img class="image_32" referrerpolicy="no-referrer"
            src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng81dd65062cf313a5a801181f9f31f400d8e1ae960c947514f2b50f3de50d83b9" />
  
            <img class="image_33" referrerpolicy="no-referrer"
            src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng4e21193f03c5865f44d8760d2cf26e6f76a779e9e2b311ef1b83c76466bab9c0" />
            <div class="image_34_text">{{ CheckPriceStatistics?.thisYearThirdQuarter }}</div>
            <img class="image_34" referrerpolicy="no-referrer"
            src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng29e46c9c1658c7754c084e6aa954ff4d7acb083b31be0ca6f0b6dd1f66485a0c" />
          <img class="image_35" referrerpolicy="no-referrer"
            src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng4e21193f03c5865f44d8760d2cf26e6f76a779e9e2b311ef1b83c76466bab9c0" />
          
            <div class="image_36_text">{{ CheckPriceStatistics?.thisYearFourthQuarter }}</div>
            <img class="image_36" referrerpolicy="no-referrer"
            src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng251bbe8fd3040a51736d7c01b8e3ced5c17aea034f56e7fed89a084f4b294c74" />
          <img class="image_37" referrerpolicy="no-referrer"
            src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPng7111ebc5ad3efe235549a77ae2fc19c73dde341705c8aa360da9dbec6a5d5d33" />
          <div class="box_47 flex-col">
            <div class="section_19 flex-col">
              <div class="box_48 flex-col">
                <span class="text_125">{{ bidSectionByName?.bidSectionName }}</span>
                <div class="text-wrapper_61 flex-col">
                  <span class="text_126">{{ bidSectionByName?.bidState }}</span>
                </div>
                <div class="text-wrapper_62 flex-row justify-between">
                  <span
                    class="paragraph_3">合&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;同：<br />年度需求：<br />月度需求：<br />到&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;货：<br />验&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;收：<br />验工计价：</span>
                  <span class="paragraph_4">{{ bidSectionByName?.contractProportion }}<br />{{ bidSectionByName?.annualDemandProportion }}<br />{{ bidSectionByName?.monthlyDemandProportion }}<br />{{ bidSectionByName?.deliveryProportion }}<br />{{ bidSectionByName?.acceptanceProportion }}<br />{{ bidSectionByName?.checkPriceProportion }}</span>
                </div>
              </div>
            </div>
          </div>
          <div class="text-wrapper_63 flex-col" @click="handleClick('中交二航局CJZQ-6标')">
            <span class="text_127">DK0+586.55</span>
          </div>
          <div class="text-wrapper_64 flex-col" @click="handleClick('中铁十二局CJZQ-4标')">
            <span class="text_128">DK46+049.11</span>
          </div>
          <div class="text-wrapper_65 flex-col" @click="handleClick('中铁十四局CJZQ-7标')">
            <span class="text_129">DK88+086.68</span>
          </div>
          <div class="text-wrapper_66 flex-col" @click="handleClick('中铁一局CJZQ-1标')">
            <span class="text_130">DK80+947.025</span>
          </div>
          <div class="text-wrapper_67 flex-col" @click="handleClick('中铁二十四局CJZQ-2标')">
            <span class="text_131">DK107+040.760</span>
          </div>
        </div>
      </div>
      <div class="group_49 flex-row">
        <span class="text_119">物资全流程可视化监控平台</span>
        <img class="image_38" referrerpolicy="no-referrer"
          src="https://lanhu-oss-2537-2.lanhuapp.com/SketchPngf0dda9f260ce8676ce50ec075e277a10d8bf55241f941fcd0e2c9374c45be84b" />
      </div>
    </div>
  </div>
</template>
<script>

import {
  queryBiddingInfo, queryProjecAmounttInfo, queryProjecDocumentInfo, queryBidSectionByName,
  queryMatCategory, queryselfBuyingMatSupervision, queryReceiveGoodsQualifiedStatistics,
  queryMaterialSupplyStatistics, queryCheckPriceStatistics, queryConstructionNotice
} from "@/utils/api"
export default {
  data() {
    return {
      constants: {},

      biddingInfo: {
        bddingSupplierCount: 20,
        winningSupplierCount: 20,
        noStartedCount: 20,
        progressCount: 20,
        completedCount: 20
      },
      projecAmounttInfo: {
        "contractAmount": 100,    	// 合同金额
        "planAmount": 50, 		 	// 计划金额
        "demandAmount": 30,     	// 需求金额
        "supplyAmount": 20,       	// 供应金额
        "deliveryCount": 18,  		// 到货金额
        "acceptanceAmount": 16,  	// 验收金额
        "settlementAmount": 12,   	// 结算金额
        "checkPriceAmount": 10,   	// 验工计价金额
        "completeBiddingPrice": 100,	// 完成招标概算价
        "bidPrice": 100,   			// 投标报价
        "noBiddingPrice": 100,   	// 未招标概算价
        "progressBiddingPrice": 100	// 招标进行中概算价
      },
      documentInfo: {
        "noticeCount": 20,  			// 通知数量
        "regulationsCount": 12, 		// 规章制度数量
        "reportCount": 2,    			// 报告数量
        "requestCount": 4        		// 请示数量
      },

      bidSectionByName: {
        "bidSectionName": 20,  					// 标段名称
        "bidState": 12, 							// 招标状态
        "contractProportion": "100%",   			// 合同占比
        "annualDemandProportion": "80%",   	// 年度需求占比
        "monthlyDemandProportion": "50%",   	// 月度需求占比
        "deliveryProportion": "90%",   			// 到货占比
        "acceptanceProportion": "90%",   		// 验收占比
        "checkPriceProportion": "80%"       		// 验工计价占比

      },
      matCategory: {
        "materialsCount": 20,  		// 材料数量
        "equipmentCount": 12, 		// 设备数量
        "sparePartsCount": 22,        // 备品备件数量
        "toolsCount": 34          	// 工器具数量
      },
      selfBuyingMatSupervision: {
        "selfBuyingMatCount": 20,  		// 重要自购物资数量
        "annualPurchasePlanCount": 12, 	// 年度采购计划数量
        "biddingSupervisionCount": 22,   // 公开招标监督数量
        "contractFilingCount": 34         // 合同核备数量

      },
      receiveGoodsQualifiedStatistics: {
        "deliveryQualifiedRate": 20,  			// 到货合格率
        "acceptanceQualificationRate": 12 	// 验收合格率

      },
      materialSupplyStatistics: {
        "dispatchedProportion": "70%",  			// 已发货
        "noDispatchedProportion": "30%", 		// 未发货
        "receivedGoodsProportion": "80%",  		// 已收货
        "noReceivedGoodsProportion": "20%" 	// 未收货

      },
      CheckPriceStatistics: {
        "thisYearFirstQuarter": 30,  			// 本年第一季度数量
        "thisYearFirstQuarter": 35, 			// 本年第二季度数量
        "thisYearFirstQuarter": 32,  			// 本年第三季度数量
        "thisYearFirstQuarter": 40, 			// 本年第四季度数量
        "cumulativeFirstQuarter": 80,  		// 开累第一季度数量
        "cumulativeFirstQuarter": 75, 			// 开累第二季度数量
        "cumulativeFirstQuarter": 78,  		// 开累第三季度数量
        "cumulativeFirstQuarter": 85 			// 开累第四季度数量

      },
      constructionNotice: {
        
      }
    };
  },

  mounted() {
    this.queryGetApi();
    this.handleClick('中交二航局CJZQ-6标')

  },

  methods: {
    async handleClick(val) {
      const json = {
        bidSectionName: JSON.stringify(val)
      }
      this.$delete(this.bidSectionByName)
      this.bidSectionByName = await queryBidSectionByName(json);
      this.$delete(this.matCategory)
      this.matCategory = await queryMatCategory(json);
      this.$delete(this.selfBuyingMatSupervision)
      this.selfBuyingMatSupervision = await queryselfBuyingMatSupervision(json);
      this.$delete(this.receiveGoodsQualifiedStatistics)
      this.receiveGoodsQualifiedStatistics = await queryReceiveGoodsQualifiedStatistics(json);
      this.$delete(this.materialSupplyStatistics)
      this.materialSupplyStatistics = await queryMaterialSupplyStatistics(json);
      this.$delete(this.CheckPriceStatistics)

      this.CheckPriceStatistics = await queryCheckPriceStatistics(json);
      this.$delete(this.constructionNotice)

      this.constructionNotice = await queryConstructionNotice(json);

      //    queryBidSectionByName, 
      // queryMatCategory, queryselfBuyingMatSupervision, queryReceiveGoodsQualifiedStatistics,
      // queryMaterialSupplyStatistics, queryCheckPriceStatistics, queryConstructionNotice
    },



    async queryGetApi() {
      this.biddingInfo = await queryBiddingInfo();
      this.projecAmounttInfo = await queryProjecAmounttInfo();
      this.documentInfo = await queryProjecDocumentInfo();
    }
  },
};
</script>

<style scoped lang="scss">
@import url("../assets/scss/common.scss");

@import url("../assets/scss/index.scss");
</style>